<template>
  <div class="empty">
    <img src="@/assets/img/order/none.png" alt />
    <div class="desc">
      <span>您还没有登录</span><br />
      <span>请登录后查看您的喜茶订单</span>
    </div>
    <div class="btn" @click="$emit('changeShow')">登录查看</div>
  </div>
</template>

<script>
export default {
  name: "orderEmpty",
};
</script>

<style scoped>
.empty img {
  width: 5rem;
  height: 5rem;
  margin: 25% 0 1rem 2.5rem;
}
.desc {
  text-align: center;
  color: #646566;
  font-size: 13px;
}
.btn {
  color: white;
  background-color: #414141;
  width: 50%;
  height: 1rem;
  border-radius: 2.5px;
  line-height: 1rem;
  text-align: center;
  margin: 1rem 0 0 2.5rem;
}
</style>